<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
    
    </style>
</head>
<body>
    <div>组数:<input type="text" id="group" required><button onclick="qd()">确定</button><button onclick="cleardom()">清空</button></div>
    <table border="1px" id="groupby">
        <tr>
            <td>组数</td>
            <td>人员分布</td>
        </tr>
    </table>
    <input type="file" id="excel">
    <span>表格示例:<img src="./images/表格示例.png"></span>
    <h3>Excel文件内容</h3>
  <div class="table">
  </div>
</body>
<!-- 预览excel文件 -->
<script src="https://cdn.bootcss.com/xlsx/0.11.5/xlsx.core.min.js"></script>
<script src="./js/jquery.min.js"></script>
<script>
    /*
    var all=[{"name":"小明","fen":32},
    {"name":"小红","fen":59},
    {"name":"小刚","fen":33},
    {"name":"小丽","fen":40},
    {"name":"小美","fen":6},
    {"name":"光头强","fen":18},
    {"name":"熊大","fen":20},
    {"name":"熊二","fen":20},
    {"name":"猪猪侠","fen":34},
    {"name":"张三","fen":70},
    {"name":"李四","fen":78},
    {"name":"王五","fen":66},
    {"name":"赵六","fen":66},
    {"name":"小七","fen":72},
    {"name":"老八","fen":70},
    {"name":"九儿","fen":60},
    {"name":"老弟","fen":63},
    {"name":"唐三","fen":90},
    {"name":"小舞","fen":82},
    {"name":"马红俊","fen":95},
    {"name":"萧炎","fen":88},
    {"name":"药岩","fen":99}
    ];*/
    var all=new Array();
    document.querySelector('#excel').onchange = function (e) {
    let file = e.target.files[0];
    readWorkbookFromLocalFile(file, function(workbook) {
      readWorkbook(workbook);
    });
  }
  
  // 读取本地excel文件，读取Excel文件对象
  function readWorkbookFromLocalFile(file, callback) {
    var reader = new FileReader();
    reader.onload = function(e) {
      var data = e.target.result;
      var workbook = XLSX.read(data, {type: 'binary'});
      console.log(workbook);
      if(callback) callback(workbook);
    };
    reader.readAsBinaryString(file);
  }
  // 转成cvs 要注意Execel表格内容不能包含英文的,不然解析出来的数据格式会有问题
  function readWorkbook(workbook) {
    var sheetNames = workbook.SheetNames; // 工作表名称集合
    var worksheet = workbook.Sheets[sheetNames[0]]; // 这里我们只读取第一张sheet
    var csv = XLSX.utils.sheet_to_csv(worksheet);
    console.log(csv);
    var rows = csv.split('\n'); // 转化为数组
    rows.shift();//第一行没用
    rows.pop(); // 最后一行没用的
    console.log("rows="+rows);  // 打印输出的数组
    for(var i=0;i<rows.length;i++){
        var stus=rows[i].split(",");
        var dx='{"name":"'+stus[0]+'","fen":'+stus[1]+'}';
    //    console.log("dx="+dx);
        var jsondx=JSON.parse(dx);
        // console.log(jsondx);
        all.push(jsondx)
    }
    let table = ``;
    rows.forEach(v => {
      let tr = ``;
      let td = ``;
      v.split(',').forEach(item => {
        td += `<td>${item}</td>`
      });
      tr = `<tr>${td}</tr>`;
      table += tr;
    });
    table = `<table>${table}</table>`;
    document.querySelector('.table').innerHTML = table; // 显示table表格
  }
    function cleardom(){
        location.reload();
    }
    //优秀
    /*
    var a=[{"name":"唐三","fen":90},
    {"name":"小舞","fen":82},
    {"name":"马红俊","fen":95},
    {"name":"萧炎","fen":88},
    {"name":"药岩","fen":99}];
    //良
    var b=[{"name":"张三","fen":70},
    {"name":"李四","fen":78},
    {"name":"王五","fen":66},
    {"name":"赵六","fen":66},
    {"name":"小七","fen":72},
    {"name":"老八","fen":70},
    {"name":"九儿","fen":60},
    {"name":"老弟","fen":63}];
    //差
    var c=[{"name":"小明","fen":32},
    {"name":"小红","fen":59},
    {"name":"小刚","fen":33},
    {"name":"小丽","fen":40},
    {"name":"小美","fen":6},
    {"name":"光头强","fen":18},
    {"name":"熊大","fen":20},
    {"name":"熊二","fen":20},
    {"name":"猪猪侠","fen":34}];*/
    //排序  0 正数 负数
    function px(x,y){
        return y.fen-x.fen; //降序
    }
    //乱序  打乱顺序
    function shuffle(a){    //a代表一个数组
        var team=0;
        for(var i=0;i<a.length;i++){    //可用var i in a 代替
        //随机数 0-4
        var k=parseInt(Math.random()*a.length);
        //a[i]=a[k]
        team=a[i];
        a[i]=a[k];
        a[k]=team;
        }
    }
//    a.sort(px);
//    console.log('排序成:'+JSON.stringify(a))
    function qd(){
    var a=new Array();
    var b=new Array();
    var c=new Array();
    for(var shu=0;shu<all.length;shu++){
        if(all[shu].fen>=80){
            a.push(all[shu])
        }else if(all[shu].fen<80&&all[shu].fen>=60){
            b.push(all[shu])
        }else{
            c.push(all[shu])
        }
    }
    //打乱
    shuffle(a)
    shuffle(b)
    shuffle(c)
    console.log('优乱序后:'+JSON.stringify(a))
    console.log('良乱序后:'+JSON.stringify(b))
    console.log('差乱序后:'+JSON.stringify(c))
    //合并concat()
    var score=a.concat(b.concat(c))
    //尾部出    push()      pop()
    //头部出    unshift()   shift()
    console.log(score)
    //长度
    var len=score.length;
    //分组
    var sz=new Array();
    for(var b=0;b<$("#group").val();b++){
        var a=new Array();
        sz.push(a)
    }
    console.log("sz="+JSON.stringify(sz))
    while(len>0){
        for(var a=0;a<sz.length;a++){
            sz[a].push(score.shift())
        }
        /*
        sz1.push(score.shift());
        if(score[len]!=null){
        sz2.push(score.shift());
        sz3.push(score.shift());
        }*/
        len=len-sz.length;
    }
    /*
        console.log("数组1="+JSON.stringify(sz[0]))
        console.log("数组2="+JSON.stringify(sz[1][0].name))
        console.log("数组3="+JSON.stringify(sz[2]))
    */
    var z='<tr>';
    for(var j=0;j<sz.length;j++){
        z=z+'<td>'+"第"+(j+1)+"组"+'</td><td>';
        for(var b=0;b<sz[j].length;b++){
            console.log("数组="+JSON.stringify(sz[j][b]));
            if(sz[j][b]!=undefined){
             z=z+sz[j][b].name+',';
            }
            
        }
        z=z+'</td></tr>';
    }
    $("#groupby").append(z);
    console.log("提交新内容git");
    }
    console.log("hello! good morning!");
    console.log("hello! good morning height")
    console.log("hello! good afternoon!");
    console.log("嘿嘿嘿");
    console.log("hello! good evening!");
    console.log("新增语句测试git")
    console.log("你好！");
</script>
</html>